import { useState, useEffect, useDebugValue } from 'react'

// 自定义 Hook
const useCount = () => {
  const [count, setCount] = useState(1)
  const add = () => {
    setCount(count + 1)
  }
  useDebugValue('myCount') // 自定义Hook起名
  return {
    count,
    add
  }
}

const useTitle = count => {
  useEffect(() => {
    document.title = `点击了${count}次`
  })
  useDebugValue('myTitle') // 自定义Hook起名
}

export default function TestHook () {
  // const [count, setCount] = useState(1)
  // const add = () => {
  //   setCount(count + 1)
  // }

  const { count, add } = useCount()

  // useEffect(() => {
  //   document.title = `点击了${count}次`
  // })

  useTitle(count)

  return (
    <div>
      <button onClick={add}>加1</button>
    </div>
  )
}
